<template>
  <div>
    <div class="back">
      <i class="el-icon-back"
         @click="goback"
         style="cursor: pointer;"></i><span>返回订单列表</span>
    </div>
    <el-form>
      <div class="bottom">商户ID：{{data.product_id}}</div>
      <div class="bottom">商户名称:{{data.product_name}}</div>
      <span>订单号:{{data.ordernumber}}</span>
      <span>订单时间：{{data.date}}</span>
      <span>订单状态：{{data.status}}</span>
      <div class="peisong">配送方式：{{data.sendway}}</div>
      <span>收货地址：{{data.send_place}}</span>
      <span>联系人：{{data.seller}}</span>
      <span>联系电话：{{data.iphone}}</span>
      <div class="pic">选购商品</div>
      <template class="image">
        <el-row>
          <el-col :span="3">
            <el-image style="width:80px; height:80px"
                      :src="data.image"
                      :span="3"></el-image>
          </el-col>
          <el-col :span="1"
                  class="chengyi">x1</el-col>
          <el-col :span="1"
                  class="chengyi"> ￥28.8</el-col>
        </el-row>
        <el-row>
          <el-col :span="3">
            <el-image style="width:80px; height:80px"
                      :src="data.image"></el-image>
          </el-col>
          <el-col :span="1"
                  class="chengyi">x1</el-col>
          <el-col :span="1"
                  class="chengyi"> ￥28.8</el-col>
        </el-row>
        <el-row>
          <el-col :span="3">
            <el-image style="width:80px; height:80px"
                      :src="data.image"></el-image>
          </el-col>
          <el-col :span="1"
                  class="chengyi"> x1</el-col>
          <el-col :span="1"
                  class="chengyi"> ￥28.8</el-col>
        </el-row>
      </template>

      <div class="bottom">包装费<span class="youhui">￥{{data.baozhuang}}</span></div>
      <div class="bottom">活动优惠 <span class="ac">暂无优惠</span></div>
      <div class="bottom">优惠券<span class="youhui">暂无优惠券</span></div>
      <div class="bottom">配送费<span class="youhui">￥{{data.sendmoney}}</span></div>
      <h3>合计：￥86.4</h3>
    </el-form>
  </div>
</template>

<script>
import '@/mock/mock.js'
export default {
  props: {

  },
  components: {

  },
  data () {
    return {
      form: {
        name: '',
        data: {}
      }
    }
  },
  created () {
    this.getlook()
  },
  methods: {
    goback () {
      this.$router.go(-1)
    },
    getlook () {
      console.log(this.$route.params)
      this.data = this.$route.params
    }
  }
}
</script>

<style scoped lang="less">
/deep/.back {
  margin-top: 25px;
}
/deep/.el-form {
  margin-top: 50px;
  margin-left: 40px;
}
span {
  margin: 15px 20px;
}
.peisong {
  margin: 15px 20px;
}
.pic {
  margin: 15px 20px;
}
.bottom {
  margin: 15px 20px;
}
h3 {
  margin-left: 400px;
}
.youhui {
  margin-left: 350px;
}
.ac {
  margin-left: 335px;
}
.el-row {
  margin-left: 140px;
}
.chengyi {
  height: 80px;
  line-height: 80px;
}
</style>
